<template>
  <div class="form-container">
    <div class="form-container-inner">
      <img src="../../assets/VIP.png" alt="" style="margin-left: -60%" />
      <div class="form" style="margin-left: 47%; margin-top: -5%">
        <form
          id="form"
          action="http://101.33.228.125:8777/alipay"
          method="post"
          style="margin-top: -65%; position: absolute"
        >
          <!--   *商户订单 :-->
          <ul>
            <li>
              <h2>订单名称:会员</h2>
              <input
                type="text"
                name="subject"
                :value="Item.subject"
                v-show="false"
              />
            </li>
            <li>
              <h2>付款金额 :{{ Item.total_amount }}</h2>
              <input
                type="text"
                name="total_amount"
                :value="Item.total_amount"
                v-show="false"
              />
            </li>
            <li>
              <h2>商品描述 :充值会员</h2>
              <input
                type="text"
                name="body"
                :value="Item.body"
                v-show="false"
              /><br />
            </li>
          </ul>

          <input type="submit" value=" " id="submit" />
          <input
            type="button"
            style="
              width: 119px;
              height: 46px;
              border: 3px solid white;
              border-radius: 20px;
              font-size: 30px;
              margin-left: 20%;
              margin-top: 12%;
              position: absolute;
            "
            @click="fail"
            value="取消"
          />
        </form>
        <!-- <button
              style="
              width: 119px;
      height: 46px;
      border: 3px solid white;
      border-radius: 20px;
      font-size: 30px;
      margin-left: 3%;
      margin-top: 86%;
      position: absolute;
              "
              @click="fail"
            >
              取消
            </button> -->
      </div>
    </div>
  </div>
</template>
  <script>
  
    
    export default {
      name: "AlipayVip",
      data() {
        return {
          Item: [
            {
              subject: "",
              total_amount: "",
              body: "",
            },
          ],
        };
      },
      methods: {
        vipdetail() {
          this.Item.total_amount = sessionStorage.getItem("viptotal");
          console.log("total-amount"+ typeof sessionStorage.getItem("viptotal"));
          this.Item.subject = "会员";
          this.Item.body = "充值会员";
 console.log(sessionStorage.getItem('userId'));
            var data = new FormData()
            data.append('userId', sessionStorage.getItem('userId'))
            this.$axios.post('/getnovipuser', data).then(resp => {
            
          })
          },

          fail() {
          this.$router.replace('/personalpage')
        }
      },
      mounted: function () {
        this.vipdetail();
      },
    };
    
</script>
  <style scoped>
#submit {
  width: 119px;
  height: 46px;
  border: 3px solid;
  border-radius: 20px;
  background: url(/src/assets/zhifubao.jpg) no-repeat center;
  margin-top: 13%;
  margin-left: -51%;
  cursor: pointer;
  color: white;

  background-size: 100%;
}
.form-container {
  width: 100%;
  height: 88%;
  position: relative;
  /* margin-left: 37%; */
  background-image: url(../../assets/eva.jpg);
  background-size: cover;
}
.form-container-inner {
  width: 35%;
  height: 23rem;
  border: 1px solid white;
  margin-left: 33%;
  position: absolute;
  padding: 2%;
  margin-top: 10%;
  background-color: rgb(57 175 191 / 48%);
}
ul {
  list-style: none;
}
h2 {
  color: white;
  margin-top: 3%;
}
</style>